<template>
  <div class="container">
    <el-dialog title="退货单审核" :visible.sync="dialogs.centerDialogVisible" @open="getData" center>
      <el-table :data="tableData" border style="width: 100%" empty-text="暂无数据">
        <el-table-column prop="name" label="商品名称" align="center"></el-table-column>
        <el-table-column prop="code" label="商品编码" align="center"></el-table-column>
        <!-- <el-table-column prop="productcode" label="商品Code" align="center"></el-table-column> -->
        <el-table-column prop="productid" label="商品Id" align="center"></el-table-column>
        <el-table-column prop="qty" label="数量" align="center"></el-table-column>
        <el-table-column prop="cost" label="成本价" align="center"></el-table-column>
        <el-table-column prop="profitvalue" label="预提" align="center"></el-table-column>
        <el-table-column prop="spillfoldvalue" label="溢折" align="center"></el-table-column>
        <el-table-column prop="allocateprice" label="调货提成" align="center"></el-table-column>
        <el-table-column prop="packagingboxprofitvalue" label="筐提成" align="center"></el-table-column>
        <el-table-column prop="costmoney" label="成本金额" align="center"></el-table-column>
        <!-- <el-table-column label="供应商" align="center" width="180">
          <template slot-scope="scope">
            <el-select
              size="small"
              v-model="scope.row.supplier_id"
              :multiple="false"
              filterable
              remote
              center
              reserve-keyword
              placeholder="请选择供应商"
              :remote-method="insideRemoteMethod"
              :loading="inside.loading"
              
            >
              <el-option
                v-for="item in inside.options"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </template>
        </el-table-column>-->
        <el-table-column label="入库价" align="center" width="180">
          <template slot-scope="scope">
            <el-input-number :controls="false" v-model="scope.row.purchase_price" size="mini"></el-input-number>
          </template>
        </el-table-column>
        <!-- <el-table-column label="皮重" align="center" width="180">
          <template slot-scope="scope">
            <el-input-number :controls="false" v-model="scope.row.tare" size="mini"></el-input-number>
          </template>
        </el-table-column>
        <el-table-column label="净重" align="center" width="180">
          <template slot-scope="scope">
            <el-input-number :controls="false" v-model="scope.row.weight" size="mini"></el-input-number>
          </template>
        </el-table-column>-->
        <el-table-column label="备注" align="center" width="180">
          <template slot-scope="scope">
            <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="scope.row.remark"></el-input>
          </template>
        </el-table-column>
      </el-table>
      <!-- <div class="pagination">
        <el-pagination
          @size-change="handleCurrentChange"
          @current-change="handleSizeChange"
          :current-page.sync="pageData.page"
          :page-sizes="pageData.pageSizes"
          :page-size="pageData.pageSize"
          :layout="pageData.layout"
          :total="pageData.total"
        ></el-pagination>
      </div>-->
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancel">取 消</el-button>
        <el-button type="primary" @click="confirm">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import { supplierList } from "@/api/supplier/supplierList";
import {
  refundGoods,
  checkRefundBill
} from "@/api/salesReturn/salesReturnList";
export default {
  props: {
    dialogs: Object
  },
  data() {
    return {
      tableData: [],
      inside: {
        innerVisible: false,
        options: [],
        value: "",
        list: [],
        loading: false,
        id: "",
        buy_order_id: ""
      }
      // pageData: {
      //   pageSizes: [10, 20],
      //   pageSize: 10,
      //   page: 1,
      //   total: null,
      //   layout: "total, sizes, prev, pager, next, jumper"
      // }
    };
  },
  methods: {
    cancel() {
      this.dialogs.centerDialogVisible = false;
    },
    // 嵌套搜索供应商数据
    insideRemoteMethod(query) {
      if (query !== "") {
        this.getSupplierList(query);
      } else {
        this.inside.options = [];
      }
    },
    //获取供应商数据
    getSupplierList(query) {
      let data = {
        name: query,
        page: 1,
        limit: 100
      };
      this.inside.loading = true;
      supplierList(data).then(res => {
        this.inside.list = res.data.data.map(item => {
          return { value: `${item.id}`, label: `${item.name}` };
        });
        this.inside.loading = false;
        this.inside.options = this.inside.list.filter(item => {
          return item.label.toLowerCase().indexOf(query.toLowerCase()) > -1;
        });
      });
    },

    //审核
    confirm() {
      console.log(this.tableData, 9999);
      let center = {};
      this.tableData.forEach(res => {
        let key = res.id;
        center[key] = {
          inp_price: res.purchase_price,
          tare: res.tare,
          weight: res.weight,
          remark: res.remark
          // supplier_id: res.supplier_id
        };
      });
      let data = {
        id: this.dialogs.auditId,
        goods: JSON.stringify(center)
      };
      // console.log(data)
      // return
      checkRefundBill(data)
        .then(res => {
          if (res.code == 0) {
            this.$message({
              message: res.msg,
              type: "success"
            });
            this.$emit("upData");
            this.cancel();
          } else {
            this.$message({
              message: res.msg,
              type: "error"
            });
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    //获取数据
    getData() {
      let data = {
        // limit: this.pageData.pageSize,
        // page: this.pageData.page,
        returnid: this.dialogs.id
      };
      refundGoods(data).then(res => {
        if (res.code == 0) {
          res.data.forEach(res => {
            res.costMsg = res.inp_price > 0 ? res.inp_price : res.cost;
            res.tare = 0;
            res.weight = 0;
          });
          this.tableData = res.data;
          // this.pageData.page = res.data.current_page;
          //   this.pageData.pagesize = res.data.per_page;
          //   this.pageData.total = res.data.total;
        }
      });
      let datas = {
        page: 1,
        limit: 50
      };
      //获取供应商列表
      supplierList(datas).then(res => {
        this.inside.options = res.data.data.map(item => {
          return { value: `${item.id}`, label: `${item.name}` };
        });
      });
    },
    //每页多少条
    handleCurrentChange(val) {
      this.pageData.page = 1;
      this.pageData.pageSize = val;
      this.getData();
    },
    //选取页数
    handleSizeChange(page) {
      this.pageData.page = page;
      this.getData();
    }
  }
};
</script>
<style scoped>
.pagination {
  text-align: right;
  padding: 10px;
}
</style>